<template>
    <div class="timeline-home">
        <div class="year">2017年</div>
        <f7-card class="news-card self-card sub-news-card">
            <div class="time">07.06&emsp;评论了</div>
            <f7-card-header>
                <h3 class="tit">
                    <f7-link href="/news/detail/">欧洲冠军联赛小组赛抽签，皇马、多特蒙德、热刺同组；巴塞罗那抽到尤文图斯；巴黎与拜仁同组。</f7-link>
                </h3>
                <f7-link class="img-wrap" href="/news/detail/">
                    <img class="img-fit" src="../../assets/images/test.jpg" alt="">
                </f7-link>
            </f7-card-header>
            <f7-card-footer>
                <div class="comments clearfix">
                    <ul class="list">
                        <li>
                            <f7-link class="user-role">角色名可以很长很长</f7-link>
                            <f7-link class="user-name">张大大:</f7-link>这个作者写的真是太好了
                        </li>
                        <li>
                            <f7-link class="user-role">角色名可以很长很长很长</f7-link>
                            <f7-link class="user-name">陈二二:</f7-link>这个作者写的真是太好了
                        </li>
                        <li>
                            <f7-link class="user-role">角色名可以很长很长很长很长</f7-link>
                            <f7-link class="user-name">王三三:</f7-link>这个作者写的真是太好了
                        </li>
                    </ul>
                    <f7-link class="link-more">75条好友叨叨>></f7-link>
                </div>
            </f7-card-footer>
        </f7-card>
        <f7-card class="news-card self-card sub-news-card">
            <div class="time">07.06&emsp;评论了</div>
            <f7-card-header>
                <h3 class="tit">
                    <f7-link href="/news/detail/">欧洲冠军联赛小组赛抽签，皇马、多特蒙德、热刺同组；巴塞罗那抽到尤文图斯；巴黎与拜仁同组。</f7-link>
                </h3>
                <f7-link class="img-wrap" href="/news/detail/">
                    <img class="img-fit" src="../../assets/images/test.jpg" alt="">
                </f7-link>
            </f7-card-header>
            <f7-card-footer>
                <div class="comments clearfix">
                    <ul class="list">
                        <li>
                            <f7-link class="user-role">角色名可以很长很长</f7-link>
                            <f7-link class="user-name">张大大:</f7-link>这个作者写的真是太好了
                        </li>
                        <li>
                            <f7-link class="user-role">角色名可以很长很长很长</f7-link>
                            <f7-link class="user-name">陈二二:</f7-link>这个作者写的真是太好了
                        </li>
                        <li>
                            <f7-link class="user-role">角色名可以很长很长很长很长</f7-link>
                            <f7-link class="user-name">王三三:</f7-link>这个作者写的真是太好了
                        </li>
                    </ul>
                    <f7-link class="link-more">75条好友叨叨>></f7-link>
                </div>
            </f7-card-footer>
        </f7-card>

         <p class="load-more">
            <f7-link>查看更多>></f7-link>
        </p>
    </div>
</template>
